<style lang="less">
 .personal-account-pal{
     .card-title{
        display: inline-block;
        width: 100%;
        height: 24px;
        line-height: 24px;
        font-size: 14px;
        color: #1c2438;
        font-weight: 700;
        overflow: inherit;
        text-overflow: ellipsis;
        white-space: nowrap;
     }
 }

</style>

<template>
    <div class="personal-account-pal">
        <Row>
            <Col span="24" class="">
                <Row>
                    <Col span="24">
                        <Card>
                            <p slot="title" class="card-title">
                                <Row class="" :gutter="10">
                                    <Col :md="4" :lg="2">
                                        <div style="margin-top: 2px;">
                                            <Icon type="ios-pulse"></Icon>
                                            {{this.$route.meta.title}}
                                        </div>
                                    </Col>
                                    <Col :md="20" :lg="22">
                                    <Form :model="formItem" :label-width="80" inline>
                                        <FormItem label="选择日期范围：">
                                            <DatePicker size="small"  :value="formItem.time" @on-ok="getEarn" @on-change="setTime" type="daterange" placeholder="Select date and time" style="width: 200px"></DatePicker>
                                        </FormItem>
                                        <Button type="primary"  size="small" style="margin-top: 5px;" @click="search">查询</Button>
                                        <Button type="ghost"  size="small" style="margin-top: 5px;" @click="searchReset">重置</Button>
                                    </Form>
                                    </Col>
                                </Row>
                            </p>
                            <div class="edittable-table-height-con">
                                <Table border stripe :columns="title" :data="data" ></Table>                                
                            </div>
                            
                        </Card>
                    </Col>
                    
                </Row>
            </Col>
        </Row>
    </div>
</template>

<script>

export default {
    data () {
        return {
            formItem:{
                time:[]
            },
            data:[{}],
            title:[
                {
                    title:'反水总额',
                    key: 'FsSum',
                    align:'center',
                    // width:'100'
                },
                {
                    title:'活动赠送',
                    key: 'ZsSum',
                    align:'center',
                    // width:'100'
                },
                {
                    title:'充值总额',
                    key: 'CzSum',
                    align:'center',
                    // width:'100'
                    render: (h, params) => {
                           return h('oc-Filter',{
                               props:{
                                   money:params.row.CzSum
                               }
                           })
                    },
                },
                {
                    title:'提现总额',
                    key: 'TxSum',
                    align:'center',
                    // width:'100'
                    render: (h, params) => {
                           return h('oc-Filter',{
                               props:{
                                   money:params.row.TxSum
                               }
                           })
                    },
                },
                {
                    title:'转出总额',
                    key: 'ZcSum',
                    align:'center',
                    // width:'100'
                    render: (h, params) => {
                           return h('oc-Filter',{
                               props:{
                                   money:params.row.ZcSum
                               }
                           })
                    },
                },
                {
                    title:'回收总额',
                    key: 'HsSum',
                    align:'center',
                    // width:'100'
                    render: (h, params) => {
                           return h('oc-Filter',{
                               props:{
                                   money:params.row.HsSum
                               }
                           })
                    },
                },
                {
                    title:'下级赊欠总额',
                    key: 'LowerAllUnPaid',
                    align:'center',
                    // width:'100'
                    render: (h, params) => {
                           return h('oc-Filter',{
                               props:{
                                   money:params.row.LowerAllUnPaid
                               }
                           })
                    },
                },
                {
                    title:'个人赊欠金额',
                    key: 'MeAllUnPaid',
                    align:'center',
                    // width:'100'
                    render: (h, params) => {
                           return h('oc-Filter',{
                               props:{
                                   money:params.row.MeAllUnPaid
                               }
                           })
                    },
                },
                {
                    title:'盈亏总额',
                    key: 'YkSum',
                    align:'center',
                    // width:'100'
                    render: (h, params) => {
                           return h('oc-Filter',{
                               props:{
                                   money:params.row.YkSum
                               }
                           })
                    },
                },
            ]
        };
    },
	mounted(){
        this.formItem.time=this.getNowFormatDate()
        this.getEarn()
	},
    methods: {
        setTime(t){
            this.formItem.time=t
            
        },
        search(){
            this.getEarn ()
        },
        searchReset(){
            this.formItem.time=this.getNowFormatDate()
            this.getEarn ()
        },
        getNowFormatDate () {
            let time = (data) =>{
                let date = new Date();
                if(data) date.setDate(date.getDate()+data);
                let Y = date.getFullYear()
                let M = date.getMonth() + 1;
                let D = date.getDate();
                let h = date.getHours()
                let m = date.getMinutes()
                let s = date.getSeconds()
                if (M >= 1 && M <= 9) M = "0" + M;
                if (D >= 0 && D <= 9) D = "0" + D;
                if (h >= 0 && h <= 9) h = "0" + h;
                if (m >= 0 && m <= 9) m = "0" + m;
                if (s >= 0 && s <= 9) s = "0" + s;
                return `${Y}-${M}-${D}`
            }
            return [time(-30),time(1)];
        },
        getEarn () {
            let data={
                time_between:`${this.formItem.time[0]},${this.formItem.time[1]}`
            }
            this.$api.repeater(this,'getEarn',data).then(res=>{
                if(res.success==true){
                    this.data=[res.data]    
                }else{
                    this.$Notice.error({
                        title: '账户资金获取失败，可能是网络故障。。',
                        desc: res.error
                    });
                }
            })
        }
    }
};
</script>